<template>
	<view style="min-height: 100vh;background: #f2f2f2;">
		<view class="header tn-padding"
			style="min-height: 300rpx;border-bottom-left-radius: 50rpx 10rpx;border-bottom-right-radius: 50rpx 10rpx;">
		</view>
		<view class="" style="display: flex;justify-content: center;">

			<view class="draw-card">
				<tn-form :model="detail" ref="form" :errorType="['message']" :labelWidth="180">
					<tn-form-item label="登录账号" prop="username" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.username" border placeholder="请输入登录账号" />
					</tn-form-item>
					<tn-form-item label="登录密码" prop="password" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.password" border placeholder="请输入登录密码" />
					</tn-form-item>
					<tn-form-item label="邮箱" prop="email" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.email" border placeholder="请输入邮箱" />
					</tn-form-item>
					<tn-form-item label="昵称" prop="nickname" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.nickname" border placeholder="请输入昵称" />
					</tn-form-item>
					
					
					
					<tn-form-item label="供应商名称" prop="supplier_brand_name" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.supplier_brand_name" border placeholder="请输入公司名称" />
					</tn-form-item>
					<tn-form-item label="地址" prop="address_detail" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.address_detail" border placeholder="请输入地址" />
					</tn-form-item>
					<tn-form-item label="联系人" prop="supplier_brand_contacts" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.supplier_brand_contacts" border placeholder="请输入联系人" />
					</tn-form-item>
					<tn-form-item label="电话" prop="supplier_brand_phone" required style="padding: 10rpx 0;">
						<tn-input v-model="detail.supplier_brand_phone" border placeholder="请输入电话" />
					</tn-form-item>
					<tn-form-item label="LOGO" style="padding: 10rpx 0;">
						<tn-image-upload :action="serverUrl" :maxCount="1" :header="header" :formData="formData"
							:index="1" @on-success="onSuccess" :fileList="listImg1"></tn-image-upload>
					</tn-form-item>
					<tn-form-item label="营业执照" style="padding: 10rpx 0;">
						<tn-image-upload :action="serverUrl" :maxCount="1" :header="header" :formData="formData"
							:index="2" @on-success="onSuccess" :fileList="listImg2"></tn-image-upload>
					</tn-form-item>
					<!-- 	<tn-form-item label="身份证正面" style="padding: 10rpx 0;">
						<tn-image-upload :action="serverUrl" :maxCount="1" :header="header" :formData="formData"
							@on-success="onSuccess" :fileList="fileList" :width="150" :height="150"></tn-image-upload>
					</tn-form-item>
					<tn-form-item label="身份证背面" style="padding: 10rpx 0;">
						<tn-image-upload :action="serverUrl" :maxCount="1" :header="header" :formData="formData"
							@on-success="onSuccess" :fileList="fileList" :width="150" :height="150"></tn-image-upload>
					</tn-form-item> -->
				</tn-form>

			</view>

		</view>
		<view style="width: 90%;margin: 20rpx auto;padding-bottom: 50rpx;">
			<!-- <view v-if="detail.is_supplier==1 || detail.is_supplier==2"
				style="margin:80rpx 0;color: #fff;font-size: 30rpx;background: rgb(251, 25, 65);padding: 20rpx;text-align: center;border-radius: 50rpx;">查看信息</view> -->
			<view v-if="!detail.is_supplier" style="margin:80rpx 0;color: #fff;font-size: 30rpx;background: rgb(251, 25, 65);padding: 20rpx;text-align: center;border-radius: 50rpx;"
				@click="submit">确认申请</view>
		</view>


	</view>
</template>


<script>
	import {
		getUserApply,
		getShopUserAccount,
		getShopUserAccountSave,
		getShopWithdrawApply,
		getUserProfile,
		getAgentInfo,
		postShopApply
	} from "@/apis/index.js"
	import {
		getToken
	} from "@/util/auth"
	export default {
		data() {
			return {
				serverUrl: "https://www.taoding1688.com/api/common/upload",
				header: {
					'token': getToken()
				},
				formData: {
					'group': 'ugc', // 其他要传的参数
				},
				fileList: [],
				address: '',
				value: '',
				type: 'textarea',
				border: true,
				height: 150,
				autoHeight: true,
				showWechat: false,
				type: '',
				show: false,
				money: '',
				withdraw: null,
				currentMode: {},
				detail: {},
				listImg1:[],
				listImg2:[],
				rules: {
					username: [{
						required: true,
						message: '请输入登录账号',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					password: [{
						required: true,
						message: '请输入登录密码',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					email: [{
						required: true,
						message: '请输入邮箱',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					nickname: [{
						required: true,
						message: '请输入昵称',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					supplier_brand_name: [{
						required: true,
						message: '请输入公司名称',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					address_detail: [{
						required: true,
						message: '请输入地址',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					supplier_brand_contacts: [{
						required: true,
						message: '请输入联系人',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}],
					supplier_brand_phone: [{
						required: true,
						message: '请输入电话',
						// 可以单个或者同时写两个触发验证方式 
						trigger: ['change', 'blur'],
					}]
				}

			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: '供应商申请'
			})
			// this.getData()
			this.getUser()
		},
		mounted() {
			let _this = this
			uni.$on('update', data => {
				console.log(data, 'aseaeas')
				_this.address = data
			});
		},
		onReady() {
			this.$refs.form.setRules(this.rules);
		},
		methods: {
			submit() {
				console.log(111)
				this.$refs.form.validate(valid => {
					console.log(valid)
					if (valid) {
						this.detail.type='supplier'
						let data={
							shop:{
								...this.detail
							}
						}
						postShopApply(data).then(res => {
							console.log(res, '=------------')
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						})
					} else {
						console.log('验证失败');
					}
				});
			},
			async getUser() {
				let {
					code,
					data
				} = await getUserApply()
				if (code == 1) {
					if (data.shop) {
						this.detail = data.shop
						console.log(this.info.app.cdnurl + data.shop.yyzz_images)
						this.detail.yyzz_images = [{
							url: this.info.app.cdnurl + data.shop.yyzz_images,
						}]
						this.detail.logo = [{
							url: this.info.app.cdnurl + data.shop.logo,
						}]
					}else{
						this.detail ={}
					}
					
				}

			},
			getDetail() {
				uni.showToast({
					title: '请耐心等待审核',
					icon: 'none'
				})
			},
			getData() {
				getAgentInfo().then(res => {
					this.detail = res.data
				})
			},
			onSuccess(data, index, lists, name) {
				console.log(data, index, lists, name)


				if (Number(name) == 1) {
					
					this.detail.logo =	data.data.url
					return
				}
				if (Number(name) == 2) {
					this.detail.yyzz_images = data.data.url
					return
				}
				// this.fileList = lists.map(item => {
				// 	return item.response.data.url
				// })
			},
			focus() {
				uni.navigateTo({
					url: '/templatePage/selectCity/selectCity'
				})
			},
			//确定按钮
			save() {
				if (this.form.type == 'wechat') {
					if (!this.form.account_name) {
						uni.showToast({
							title: '请输入真实姓名',
							icon: 'none'
						})
						return
					}
				}
				getShopUserAccountSave(this.form).then(res => {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				})


			}


		}
	}
</script>

<style lang="scss" scoped>
	.header {
		background: rgb(251, 25, 65)
	}

	.color999 {
		color: #999;
	}

	.draw-card {
		background: #fff;
		min-height: 300rpx;
		width: 93%;
		margin-top: -100rpx;
		padding: 30rpx;
		border-radius: 20rpx;
	}
</style>